.ant-drawer-body {
  padding: 0 !important;
  overflow: hidden;
}
.preview {
  width: 100%;
  height: 100%;
  .code-container {
    // width: 100%;
    // height: 100%;
    background-color: var(--editor-bg-color);
    // .ant-tabs-content {
    //   height: 100%;
    // }
    .ant-tabs-nav {
      margin-bottom: 0 !important;
      // display: block;
      &::before {
        border: none !important;
      }
    }
    .ant-tabs-nav-wrap {
      background-color: var(--editor-main-bg-color);
      &::before {
        border-color: var(--editor-tab-bg-color);
      }
      .ant-tabs-tab {
        border: 0 !important;
        color: var(--editor-text-color) !important;
        background-color: var(--editor-tab-bg-color);
      }
      .ant-tabs-tab-active {
        background-color: rgb(30, 30, 30);
        .ant-tabs-tab-btn {
          color: #fff !important;
        }
      }
    }
    .ant-tabs-extra-content {
      height: 100%;
      background-color: var(--editor-main-bg-color) !important;
      .ant-space-item {
        &:hover {
          background-color: var(--editor-bg-color) !important;
        }
        .extra-action {
          color: var(--editor-text-color);
          &:hover {
            color: var(--main-color);
          }
          span:first-child {
            display: inline-block;
            vertical-align: middle;
          }
        }
      }
      .extra-action-container {
        height: 100%;
      }
    }
  }
  .form {
    .body {
      padding: 12px;
      height: calc(100% - 35px);
    }
  }
}

.Pane2 {
  overflow-y: auto;
  overflow-x: hidden;
}

.Resizer {
  background: #000;
  opacity: 0.2;
  z-index: 1;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -moz-background-clip: padding;
  -webkit-background-clip: padding;
  background-clip: padding-box;
}

.Resizer:hover {
  -webkit-transition: all 2s ease;
  transition: all 2s ease;
}

.Resizer.horizontal {
  height: 11px;
  margin: -5px 0;
  border-top: 5px solid rgba(255, 255, 255, 0);
  border-bottom: 5px solid rgba(255, 255, 255, 0);
  cursor: row-resize;
  width: 100%;
}

.Resizer.horizontal:hover {
  border-top: 5px solid rgba(0, 0, 0, 0.5);
  border-bottom: 5px solid rgba(0, 0, 0, 0.5);
}

.Resizer.vertical {
  width: 11px;
  margin: 0 -5px;
  border-left: 5px solid rgba(255, 255, 255, 0);
  border-right: 5px solid rgba(255, 255, 255, 0);
  cursor: col-resize;
}

.Resizer.vertical:hover {
  border-left: 5px solid rgba(0, 0, 0, 0.5);
  border-right: 5px solid rgba(0, 0, 0, 0.5);
}
.Resizer.disabled {
  cursor: not-allowed;
}
.Resizer.disabled:hover {
  border-color: transparent;
}
